<!DOCTYPE html>
<html class="x-admin-sm">

<head>
    <meta charset="UTF-8">
    <title>药房库存查询</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="stylesheet" href="../../css/font.css">
    <link rel="stylesheet" href="../../css/xadmin.css">
    <link rel="stylesheet" href="../../lib/layui/css/layui.css"  media="all">
    <script src="../../lib/layui/layui.js" charset="utf-8"></script>
    <script src="../../js/jquery.min.js"></script>
    <script type="text/javascript" src="../../js/xadmin.js"></script>
    <script src="../../js/MyCommon.js"></script>
</head>

<body>
<div class="x-nav">
          <span class="layui-breadcrumb">
            <a href="">首页</a>
           
            <a>
              <cite>药房库存查询</cite></a>
          </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       onclick="location.reload()" title="刷新">
        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a>
</div>


<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
                    <form class="layui-form layui-col-space5">
                        <div class="layui-inline layui-show-xs-block">
                            <input type="text" name="drugsName" id="drugsName" placeholder="请输入药品名称" autocomplete="off"
                                   class="layui-input">
                        </div>
                        <div class="layui-inline layui-show-xs-block">
                            <button class="layui-btn layui-btn-warm" lay-submit=""  id="sreach" lay-filter="sreach"><span class="layui-icon">&#xe615;</span>查询</button>
                        </div>
                    </form>
                </div>
                <div class="layui-card-body layui-table-body layui-table-main" style="width:60%;">
                    <table class="layui-table layui-form" id="demo" lay-filter="demo">
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</body>
<script>
     layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element', 'slider', 'form'], function () {
         var laydate = layui.laydate //日期
             , laypage = layui.laypage //分页
             , layer = layui.layer //弹层
             , table = layui.table //表格
             , carousel = layui.carousel //轮播
             , upload = layui.upload //上传
             , element = layui.element //元素操作
             , slider = layui.slider //滑块
             , table = layui.table
             , form = layui.form
         //进入页面渲染表格
         table.render({
             elem: '#demo'
             , id: 'test'
             , url: '/JT90/StockInquiryController/queryList2' //数据接口
             , page: {
                 layout: ['limit', 'count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
                 , groups: 5 //只显示 1 个连续页码
                 , first: '首页'//不显示首页
                 , last: '尾页' //不显示尾页
                 , limit: 5
                 , limits: [5, 10, 15, 20]
                 , theme: '#44cc33'
                 , jump: function (obj) {
                     console.log("直接加载页面，分页jump回调的obj" + obj)
                 }
             }//开启分页
             , cols: [[ //表头
                 {field: 'drugsName', title: '药品名称', align: "center"}
                 , {field: 'inventoryNumber', title: '库存数量', style: "color:red", align: "center"}
                 , {field: 'warehouseUnit', title: '仓库单位', align: "center"}
             ]]
             , even: true
         });

         //监听查询按钮的分页显示，根据药品名称查询
         form.on('submit(sreach)', function () {
             var drugsName = $('#drugsName').val();
             console.log("要查询的药品名称" + drugsName);
             $.ajax({
                 url: '/JT90/StockInquiryController/queryList2',//地址
                 dataType: 'json',//数据类型
                 data: "drugsName=" + drugsName,
                 type: 'GET',//类型
                 contentType: 'application/json;charset=UTF-8',
                 //请求成功
                 success: function () {
                     //分页
                     table.render({
                         elem: '#demo'
                         , id: 'test'
                         , url: '/JT90/StockInquiryController/queryList2?drugsName=' + drugsName //数据接口
                         , page: {
                             layout: ['limit', 'count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
                             , groups: 5 //只显示 1 个连续页码
                             , first: '首页'//不显示首页
                             , last: '尾页' //不显示尾页
                             , limit: 5
                             , limits: [5, 10, 15, 20]
                             , theme: '#44cc33'
                             , jump: function (obj) {
                                 console.log(obj)
                             }
                         }//开启分页
                         , cols: [[ //表头
                             {field: 'drugsName', title: '药品名称', align: "center"}
                             , {field: 'inventoryNumber', title: '库存数量', style: "color:red", align: "center"}
                             , {field: 'warehouseUnit', title: '仓库单位', align: "center"}
                         ]]
                         , even: true
                     });
                 }
             });

             return false;
         })

     })


</script>

</html>